<template>
    <view class="suggest-container">
        <nav-bar title="建议"></nav-bar>
        <!-- <view class="suggest-input">
            <view class="suggest-input-box">
                <input
                    type="number"
                    placeholder="请输入您的姓名"
                    placeholder-class="suggest-input-placeholder"
                    v-model="form.name"
                    maxlength="12"
                />
            </view>
            <view class="suggest-input-box">
                <input
                    type="number"
                    placeholder="请输入您的手机号码/邮箱/微信"
                    placeholder-class="suggest-input-placeholder"
                    v-model="form.tel"
                    maxlength="12"
                />
            </view>
        </view> -->
        <view class="suggest-textarea">
            <textarea
                name=""
                id=""
                cols="30"
                rows="10"
                placeholder="请输入您的建议"
                placeholder-class="suggest-input-placeholder"
                v-model="form.suggest"
            ></textarea>
        </view>
        <view class="suggest-message">
            <view>尊敬的用户您好：</view>
            <view>感谢您对我们的建议，我们将尽快给您反馈。</view>
            <view>谢谢！</view>
        </view>
        <text class="suggest-btn"> 确定提交 </text>
        <u-toast ref="uToast" />
    </view>
</template>

<script>
import NavBar from "components/NavBar";
export default {
    components: {
        NavBar,
    },
    data() {
        return {
            form: {
                name: "",
                tel: "",
                suggest: "",
            },
        };
    },
    methods: {
        handleClick() {
            if (this.checkForm()) {
                this.changeNicknameReq();
            }
        },
        checkForm() {
            if (!this.form.nickName) {
                this.$u.toast("请输入昵称");
                return false;
            }
            return true;
        },
        toSetting() {
            uni.navigateTo({
                url: "/pages/setting/setting",
            });
        },
        postSuggest() {
            let that = this;
            let o = {};

            this.$u
                .post("user_advice", {
                    nickname: that.form.nickName,
                })
                .then(() => {
                    that.$u.toast("修改成功");
                    setTimeout(() => {
                        that.toSetting();
                    }, 500);
                });
        },
    },
};
</script>

<style scoped>
page {
    background-color: rgb(253, 253, 240);
}
.suggest-container {
    width: 100%;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    align-content: center;
}
.suggest-input {
    display: flex;
    flex-direction: column;
    align-items: center;
    margin-top: 60rpx;
    padding: 20rpx;
}
.suggest-input-box {
    width: 100%;
    box-sizing: border-box;
    margin-top: 80rpx;
    border-bottom: 2rpx solid #fff;
    padding-bottom: 40rpx;
}
.suggest-input-placeholder {
    font-size: 32rpx;
}
.suggest-input-forget {
    width: 100%;
    text-align: end;
    margin-top: 20rpx;
    padding-right: 20rpx;
}
.suggest-btn {
    width: 700rpx;
    background-color: rgb(51, 204, 0);
    text-align: center;
    margin-top: 80rpx;
    padding: 30rpx 40rpx;
    position: relative;
    left: 50%;
    transform: translateX(-50%);
    border-radius: 80rpx;
    font-size: 40rpx;
    color: #fff;
}
.suggest-textarea {
    width: 100%;
    box-sizing: border-box;
    background-color: #fff;
}
.suggest-textarea textarea {
    padding: 40rpx;
}
.suggest-message {
    margin-top: 40rpx;
    margin-left: 20rpx;
    color: rgb(170, 170, 170);
}
</style>
